import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
    selector: 'app-test-child',
    template: `
      <h1>hhhhhh</h1>
      <p>{{name}}</p>
      <button (click)="vote(true)" >agree</button>
      <button (click)="vote(false)" >Disagree</button>

      <p>{{message}}</p>
    `

})

export class TestChildComponent {
   
  @Input() name: string;

  @Output() voted2 = new EventEmitter<boolean>();

  didVote = false;
  vote(v: boolean) {
    this.voted2.emit(v)
    this.didVote = true;
  }


  start() { this.countDown();}
  stop() {
    this.clearTimer();
    this.message = `holding at T-${this.seconds} seconds`;
  }
  intervalId = 0;
  message = ''
  seconds = 11

  clearTimer() { clearInterval(this.intervalId)}

  private countDown() {
    this.clearTimer();
    this.intervalId = window.setInterval(()=> {
      this.seconds -= 1;
      if (this.seconds ===0) {
        this.message = "Blast off!";
      } else {
        if (this.seconds <0) { this.seconds = 10}
        this.message = `T-${this.seconds} seconds and couting`;
      }
    }, 1000)
  }


}